<template>
	<view class="alert-mode" v-if="dialog">
		<view class="alert-dialog">
			<view class="alert-title">温馨提示</view>
			<view class="alert-body">
				<image :src="icon" mode='widthFix' class="alert-icon"></image>
				<view class="alert-msg">{{txt}}</view>
			</view>
			<view class="alert-btn">
				<view class="alert-confirm">
					<view class="alert-false" @tap="btnClick(0)">取消</view>
					<view class="alert-true" @tap="btnClick(1)">确定</view>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	export default{
		props:{dialog:{},txt:{},icon:{}},
		methods:{
			btnClick(param) {
				this.$emit('btn-click',param);
			}
		}
	}
</script>

<style>
	.alert-mode{position: fixed;width: 100%;height: 100%;top:0;left:0;background: rgba(0,0,0,0.5);z-index: 99;}
	.alert-dialog{width: 560upx;background: #fff;border-radius: 30upx;margin:30% auto;}
	.alert-title{height: 90upx;text-align: center;line-height:90upx;font-size: 34upx;border-bottom: 1upx solid #f0f0f0;}
	.alert-icon{display: block;width: 150upx;margin:20upx auto;height: 150upx; }
	.alert-msg{text-align: center;color:#adadad;height: 40upx;line-height: 40upx;margin-top: 10upx;font-size: 28upx;}
	.alert-btn{height: 90upx;line-height: 90upx;margin-top:30upx;border-top:1upx solid #f0f0f0;}
	.alert-confirm{overflow: hidden;}
	.alert-confirm > view{float: left;text-align: center;width: 50%;box-sizing: border-box;}
	.alert-true{color:#d3161a;border-left: 1upx solid #f0f0f0;}
</style>
